<!--
   @params1: selectList: 参照选择————列表
 * @params2: valueBridge: 选择的值———列表
 * @params3: value: v-model绑定的值,存到数据库的数据————字符串
 * @params4: checkStrictly: 是否可选择非末端数据，默认false不可选
 * @params5: singleSelect 默认false 是否单选，true为单选，false为多选
 * @params6: datacode 必传，需要使用的编码
 * @params7: dataplace 数字必传，0表示1、1-1、1-1-1模式；大于1表示位数，如dataplace=2，表示01、0101、010101模式
 * @params8: isShowEnabled 是否显示无效的编码，默认显示
 * @params9: @input="XXX" 父组件必用 传值value值到父组件使用
!-->
<template>
  <div>
  <el-cascader :disabled="disabled" :options="selectList" v-model="valueBridge" placeholder="可搜索" filterable :props="{ checkStrictly: checkStrictly, multiple: singleSelect }" clearable></el-cascader>
  </div>
</template>

<script>
import { queryDataCode } from '@tapui/api/dataCode'
import { putAction, getAction, postAction, deleteAction } from '@tapui/utils/http'
export default {
  data() {
    return {
      url: {
				// 额外的url
        queryDataCode: 'qms/qemProblemAlert/queryDataCode'
			},
      selectList: [],
      valueBridge: []
    }
  },
  props: {
    singleSelect: {
      type: Boolean,
      default: false
    },
    value: {
      default: '',
      type: [String, Number]
    },
    disabled: {
      type: Boolean,
      defalt: false
    },
    datacode: {
      type: String,
      default: ''
    },
    dataplace: {
      type: Number,
      default: 0
    },
    checkStrictly: {
      type: Boolean,
      default: false
    },
    isShowEnabled: {
      type: Boolean,
      default: true
    }
  },
  methods: {
    queryDataCodeShowEnabled() {
      queryDataCode({ itemCodes: this.datacode }).then((res) => {
        let tempList = res.result[this.datacode]
        if (this.dataplace === 0) {
          this.splitTreeByUnderline(tempList)
        } else {
          this.splitTreeByPlace(tempList)
        }
      })
    },
    // 查询编码值
		queryDataCodeNotShowEnabled() {
      getAction(this.url.queryDataCode, { datacode: this.datacode }).then(res => {
        if (res.success) {
          let tempList = res.result
          if (this.dataplace === 0) {
            this.splitTreeByUnderline(tempList)
          } else {
            // 待添加
            this.splitTreeByPlace(tempList)
          }
        }
      })
    },
    // 01 0101 010101类型
    splitTreeByPlace(tempList) {
      for (let parentItem of tempList) {
        if (parentItem.enabled === 0) {
          continue
        }
        let childrenList = []
        parentItem.value = parentItem.code
        parentItem.label = parentItem.name
        for (let childrenItem of tempList) {
          if (childrenItem.enabled === 0) {
            continue
          }
          let tempcode = parentItem.code
          if (childrenItem.code.indexOf(tempcode) === 0 && childrenItem.code !== parentItem.code) {
            childrenList.push(childrenItem)
          }
        }
        if (childrenList.length > 0) {
          parentItem.children = childrenList
        }
        if (parentItem.code.length === this.dataplace) {
          this.selectList.push(parentItem)
        }
      }
    },
    // 1 1-1 1-1-1类型
    splitTreeByUnderline(tempList) {
      for (let parentItem of tempList) {
        if (parentItem.enabled === 0) {
          continue
        }
        let childrenList = []
        parentItem.value = parentItem.code
        parentItem.label = parentItem.name
        for (let childrenItem of tempList) {
          if (childrenItem.enabled === 0) {
            continue
          }
          let tempcode = parentItem.code + '-'
          if (childrenItem.code.indexOf(tempcode) === 0) {
            childrenList.push(childrenItem)
          }
        }
        if (childrenList.length > 0) {
          parentItem.children = childrenList
        }
        if (parentItem.code.indexOf('-') < 0) {
          this.selectList.push(parentItem)
        }
      }
    }
  },
  created() {
    this.selectList = []
    // this.valueBridge = this.value
    if (this.isShowEnabled) {
      this.queryDataCodeNotShowEnabled()
    } else {
      this.queryDataCodeShowEnabled()
    }
  },
  watch: {
    isShowEnabled(newVal, oldVal) {
      this.selectList = []
      if (newVal) {
        this.queryDataCodeNotShowEnabled()
      } else {
        this.queryDataCodeShowEnabled()
      }
    },
    value(newVal, oldVal) {
      if (newVal === '') {
        this.valueBridge = []
        return
      }
      let newTempList = []
      if (this.dataplace === 0) {
        let tempList = this.value.split('-')
        let temp = ''
        for (let i of tempList) {
          if (temp === '') {
            temp = i
          } else {
            temp = temp + '-' + i
          }
          newTempList.push(temp)
        }
      } else {
        // 待添加
        let index = this.value.length / this.dataplace
        let temp = this.value.substring(0, this.dataplace)
        for (let i = 1; i <= index; i++) {
          newTempList.push(temp)
          temp = this.value.substring(0, this.dataplace * (i + 1))
        }
      }
      this.valueBridge = newTempList
    },
    valueBridge(newVal, oldVal) {
      // this.value = newVal[newVal.length - 1]
      this.$emit('inputvalue', newVal[newVal.length - 1])
      // validateField
      // this.$parent.form.clearValidate()
    }
  }
}
</script>

<style scoped lang="scss">
.input-with-select {
  .el-select {
    width: 80px;
  }
}
</style>
